<template>
  <div>
    <el-button type="primary" @click="back">返回</el-button>
    <h1>这是 App 根组件{{ a }}</h1>
    <div class="btn-group" data-toggle="buttons">
      <label class="btn btn-primary"> <input type="checkbox" /> 选项 1 </label>
      <label class="btn btn-primary"> <input type="checkbox" /> 选项 2 </label>
      <label class="btn btn-primary"> <input type="checkbox" /> 选项 3 </label>
    </div>
    <el-table
      ref="multipleTable"
      :data="tableData"
      tooltip-effect="dark"
      style="width: 100%"
      @selection-change="handleSelectionChange"
    >
      <el-table-column type="selection" width="55"> </el-table-column>
      <el-table-column label="日期" width="120">
        <template slot-scope="scope">{{ scope.row.date }}</template>
      </el-table-column>
      <el-table-column prop="name" label="姓名" width="120"> </el-table-column>
      <el-table-column prop="address" label="地址" show-overflow-tooltip>
      </el-table-column>
    </el-table>
    <input type="text" placeholder="ceshi" />
    <ul>
      <li>第1个li</li>
      <li>第2个li</li>
      <li>第3个li</li>
      <li>第4个li</li>
      <li>第5个li</li>
      <li>第6个li</li>
      <li>第7个li</li>
      <li>第8个li</li>
      <li>第9个li</li>
    </ul>
    <img src="@static/images/error.png" alt="error.png" />
    <img src="@assets/images/1.jpg" alt="1.jpg" />
    <el-row>
      <el-button>默认按钮</el-button>
      <el-button type="primary">主要按钮</el-button>
      <el-button type="success">成功按钮</el-button>
      <el-button type="info">信息按钮</el-button>
      <el-button type="warning">警告按钮</el-button>
      <el-button type="danger">危险按钮</el-button>
    </el-row>
  </div>
</template>

<script>
export default {
  data() {
    return {
      a: "6767767qqq2",
      tableData: [
        {
          date: "2016-05-03",
          name: "王小虎",
          address: "上海市普陀区金沙江路 1518 弄",
        },
        {
          date: "2016-05-02",
          name: "王小虎",
          address: "上海市普陀区金沙江路 1518 弄",
        },
        {
          date: "2016-05-04",
          name: "王小虎",
          address: "上海市普陀区金沙江路 1518 弄",
        },
        {
          date: "2016-05-01",
          name: "王小虎",
          address: "上海市普陀区金沙江路 1518 弄",
        },
        {
          date: "2016-05-08",
          name: "王小虎",
          address: "上海市普陀区金沙江路 1518 弄",
        },
        {
          date: "2016-05-06",
          name: "王小虎",
          address: "上海市普陀区金沙江路 1518 弄",
        },
        {
          date: "2016-05-07",
          name: "王小虎",
          address: "上海市普陀区金沙江路 1518 弄",
        },
      ],
      multipleSelection: [],
    };
  },
  mounted() {
    this.test(2);
    this.$refs.multipleTable.toggleAllSelection();
  },
  methods: {
    back() {
      top.postMessage("isTrue", "*");
    },
    toggleSelection(rows) {
      if (rows) {
        rows.forEach((row) => {
          this.$refs.multipleTable.toggleRowSelection(row);
        });
      } else {
        this.$refs.multipleTable.clearSelection();
      }
    },
    handleSelectionChange(val) {
      this.multipleSelection = val;
    },
    test(params) {
      let p1 = new Promise(function (resolve, rejected) {
        if (params == 1) {
          resolve("正常");
        } else {
          rejected("错误");
        }
      });
      p1.then((res) => {
        console.log(res, "333333");
      }).catch((err) => {
        console.log(err, "6666666");
      });
      return console.log("chenshanqiang123ddd");
    },
  },
};
</script>

<style scoped>
h1 {
  color: red;
}
</style>
